<template>
	<view>
		share
		{{addrDel}}
		<button @click="getPosition">获取定位</button>
	
			<button @click="goPage">闹钟</button>
			<button @click="goPage1">去往开始启动页面</button>
			<button @click="goPage2">去往登录页面</button>
			
			
			<button @click="goMap">跳转地图</button>
			
			<button @click="openMap">打开地图</button>
			
			<button @click="openClockPage">设置闹钟-应用保活</button>
			
			
			<button @click="openDel">删除弹窗</button>
			<!-- 删除弹窗 -->
			<!-- borderRadius -->
			<uni-popup ref="delpopup"
			mask-background-color="rgba(0,0,0,0.5)"
			 borderRadius="32rpx 32rpx 32rpx 32rpx"
			 type="center" background-color="#fff" :mask-click="false">
				<div class="delbox">
					<div class="title">
						<text>提示</text>
					</div>
					<div class="desc" >
						<text>确定删除风隐天骄酒店？</text>
					</div>
					<div class="footer">
						<button class="confirm">确定</button>
						<button @click="cancelDel" class="cancel">取消</button>
					</div>
				</div>
			</uni-popup>
			
			
			<button @click="opentimeDialog">删除出行时间弹窗</button>
			<uni-popup ref="timepopup"
			mask-background-color="rgba(0,0,0,0.5)"
			 borderRadius="32rpx 32rpx 32rpx 32rpx"
			 type="bottom" background-color="#fff" :mask-click="false">
				<div class="timebox">
					<div class="title">
						<text>风隐天骄酒店</text>
						<image src="/static/image/travel/close.png" mode=""></image>
					</div>
					<div class="boxaa">
						<div class="box">
							<text>出行方式</text>
							<image src="/static/image/publish/right.png" mode=""></image>
						</div>
						<div class="box">
							<text>选择时间</text>
							<image src="/static/image/publish/timeselect.png" mode=""></image>
						</div>
					</div>
					<div class="desc" >
						<image src="/static/image/publish/add.png" mode=""></image>
						<text>添加出行方式和时间</text>
					</div>
					<div class="footer">
						<button class="confirm" @click="timeFinished">完成</button>
					</div>
				</div>
			</uni-popup>
			
			
			<button @click="opentravelDialog">删除游玩时间弹窗</button>
			<uni-popup ref="travelpopup"
			mask-background-color="rgba(0,0,0,0.5)"
			 borderRadius="32rpx 32rpx 32rpx 32rpx"
			 type="bottom" background-color="#fff" :mask-click="false">
				<div class="time2box">
					<div class="title">
						<text>风隐天骄酒店</text>
						<image src="/static/image/travel/close.png" mode=""></image>
					</div>
					<div class="boxaa">
						<div class="box">
							<text>开始时间</text>
							<image src="/static/image/publish/right.png" mode=""></image>
						</div>
						<div class="box">
							<text>结束时间</text>
							<image src="/static/image/publish/timeselect.png" mode=""></image>
						</div>
					</div>
					<div class="desc" >
						<!-- <image src="/static/image/publish/add.png" mode=""></image> -->
						<text>游玩合计：30分钟</text>
					</div>
					<div class="footer">
						<button class="confirm" @click="travelFinished">完成</button>
					</div>
				</div>
			</uni-popup>
			
			
			<button @click="openclockDialog">删除闹钟弹窗</button>
			<uni-popup ref="clockpopup"
			mask-background-color="rgba(0,0,0,0.5)"
			 borderRadius="32rpx 32rpx 32rpx 32rpx"
			 type="bottom" background-color="#fff" :mask-click="false">
				<div class="clockbox">
					<div class="title">
						<text>风隐天骄酒店</text>
						<image src="/static/image/travel/close.png" mode=""></image>
					</div>
					<div class="boxaa">
						<div class="box">
							<text>选择日期</text>
							<image src="/static/image/publish/dateselect.png" mode=""></image>
						</div>
						<div class="box">
							<text>选择时间</text>
							<image src="/static/image/publish/timeselect.png" mode=""></image>
						</div>
					</div>
			<!-- 		<div class="desc" >
						<image src="/static/image/publish/add.png" mode=""></image>
						<text>游玩合计：30分钟</text>
					</div> -->
					<div class="footer">
						<button class="confirm" @click="clockFinished">完成</button>
					</div>
				</div>
			</uni-popup>
			
			
			<!-- 景点信息弹窗 -->
			<button @click="openscenDialog">删除景区详情弹窗</button>
			<uni-popup ref="scenpopup"
			mask-background-color="rgba(0,0,0,0.5)"
			 borderRadius="32rpx 32rpx 32rpx 32rpx"
			 type="bottom" background-color="#fff" :mask-click="false">
				<div class="scenbox">
					<div class="title">
						<text class="a">风隐天骄酒店</text>
						<text class="b">导航去这里</text>
					</div>
					<div class="subtitle">
						<text class="left">游玩时间</text>
						<text class="right">游玩合计：- -</text>
					</div>
					<div class="box11">
						<div class="box">
							<text>开始时间</text>
							<!-- <image src="/static/image/publish/right.png" mode=""></image> -->
						</div>
						<text class="splite"></text>
						<div class="box">
							<text>结束时间</text>
							<!-- <image src="/static/image/publish/timeselect.png" mode=""></image> -->
						</div>
					</div>
					<div class="subtitle">
						<text class="left">闹钟</text>
						<!-- <text class="right">游玩合计：- -</text> -->
					</div>
					<div class="boxaa">
						<div class="box">
							<text>选择日期</text>
							<image src="/static/image/publish/dateselect.png" mode=""></image>
						</div>
						<text class="splite"></text>
						<div class="box">
							<text>选择时间</text>
							<image src="/static/image/publish/timeselect.png" mode=""></image>
						</div>
					</div>
					<div class="subtitle">
						<text class="left">备注</text>
						<!-- <text class="right">游玩合计：- -</text> -->
					</div>
					<div class="beizhu" >
						<!-- <image src="/static/image/publish/add.png" mode=""></image> -->
						<!-- <text>游玩合计：30分钟</text> -->
						<input type="text" placeholder="请在此处输入备注信息～" />
					</div>
					<div class="footer">
						<button class="confirm" @click="scenFinished">完成</button>
					</div>
				</div>
			</uni-popup>
			
			
		<!-- <tabbar selected="3"></tabbar> -->
	</view>
</template>

<script>
	import tabbar from "../../components/tabbar/tabbar.vue";
	// import {
	//     alarmAdd,
	//     alarmDelete
	// } from "@/uni_modules/laoqianjunzi-alarm"; 
	    // const app = getApp();
		// import {
		//         calendarAdd,
		//         calendarDelete
		//     } from "@/uni_modules/laoqianjunzi-calendar";
	

	export default {
		components: {
			tabbar: tabbar
		},
		data() {
			return {
				addrDel: '',
				mapList: [
					{ title: '高德地图', name: 'amap', androidName: 'com.autonavi.minimap', iosName: 'iosamap://' },
					{ title: '百度地图', name: 'baidumap', androidName: 'com.baidu.BaiduMap', iosName: 'baidumap://' },
					{ title: '腾讯地图', name: 'qqmap', androidName: 'com.tencent.map', iosName: 'qqmap://' }
				  ],
				  latitude: '22.5500342',
				  longitude: '114.0672706',
				  name: '深圳市政府',
				  myLocation: {
					latitude: 17.1234,
					longitude: 84.3465686
				  }
			}
		},
		mounted() {
			
		},
		methods: {
			openscenDialog() {
				this.$refs.scenpopup.open()
			},
			scenFinished() {
				this.$refs.scenpopup.close()
			},
			clockFinished() {
				this.$refs.clockpopup.close()
			},
			 openclockDialog() {
				this.$refs.clockpopup.open()
			},
			travelFinished() {
				this.$refs.travelpopup.close()
			},
			opentravelDialog() {
				this.$refs.travelpopup.open()
			},
			timeFinished() {
				this.$refs.timepopup.close()
			},
			opentimeDialog() {
				this.$refs.timepopup.open()
			},
			openDel() {
				this.$refs.delpopup.open()
			},
			cancelDel() {
				this.$refs.delpopup.close()
			},
			openClockPage() {
				uni.navigateTo({
					url: '/pages/keeyalive/keeyalive'
				})
			},
			openMap() {
				uni.navigateTo({
					url: '/pages/showmap/showmap'
				})
			},
			openURL(map, platform) {
			  let urls = {
				android: {
				  amap: `amapuri://route/plan/?sid=&did=&dlat=${this.latitude}&dlon=${this.longitude}&dname=${this.name}&dev=0&t=0`,
				  qqmap: `qqmap://map/routeplan?type=drive&to=${this.name}&tocoord=${this.latitude},${this.longitude}&referer=ixinyi_client`,
				  baidumap: `baidumap://map/direction?origin=${this.myLocation.latitude},${this.myLocation.longitude}&destination=name:${this.name}|latlng:${this.latitude},${this.longitude}&coord_type=wgs84&mode=driving&src=andr.baidu.openAPIdemo"`
				},
				ios: {
				  amap: `iosamap://path?sourceApplication=ixinyi_client&dlat=${this.latitude}&dlon=${this.longitude}&dname=${this.name}&dev=0&t=0`,
				  qqmap: `qqmap://map/routeplan?type=drive&to=${this.name}&tocoord=${this.latitude},${this.longitude}&referer=ixinyi_client`,
				  baidumap: `baidumap://map/direction?origin=${this.myLocation.latitude},${this.myLocation.longitude}&destination=name:${this.name}|latlng:${this.latitude},${this.longitude}&mode=driving&src=ios.baidu.openAPIdemo`
				}
			  };
			  let newurl = encodeURI(urls[platform][map.name]);
			  console.log(newurl);
			  plus.runtime.openURL(
				newurl,
				function (res) {
				  uni.showModal({
					content: res.message
				  });
				},
				map.androidName ? map.androidName : ''
			  );
			},
			goMap() {
				// #ifdef APP-PLUS
				  // 判断系统安装的地图应用有哪些, 并生成菜单按钮
				  let mapList = [
					{ title: '高德地图', name: 'amap', androidName: 'com.autonavi.minimap', iosName: 'iosamap://' },
					{ title: '百度地图', name: 'baidumap', androidName: 'com.baidu.BaiduMap', iosName: 'baidumap://' },
					{ title: '腾讯地图', name: 'qqmap', androidName: 'com.tencent.map', iosName: 'qqmap://' }
				  ];
				  // 根据真机有的地图软件 生成的 操作菜单
				  let buttons = [];
				  let platform = uni.getSystemInfoSync().platform;
				  platform === 'android' &&
					mapList.forEach(item => {
					  if (plus.runtime.isApplicationExist({ pname: item.androidName })) {
						buttons.push(item);
					  }
					});
				  platform === 'ios' &&
					mapList.forEach(item => {
					  console.log(item.iosName);
					  if (plus.runtime.isApplicationExist({ action: item.iosName })) {
						buttons.push(item);
					  }
					});
				  if (buttons.length) {
					plus.nativeUI.actionSheet(
					  {
						//选择菜单
						title: '选择地图应用',
						cancel: '取消',
						buttons: buttons
					  },
					  e => {
						let _map = buttons[e.index - 1];
						this.openURL(_map, platform);
					  }
					);
				  } else {
					uni.showToast({
					  title: '请安装地图软件',
					  icon: 'none'
					});
					return;
				  }
				  // #endif
			},
			goPage1() {
				uni.navigateTo({
					url: '/pages/startPage/startPage'
				})
			},
			goPage2() {
				uni.navigateTo({
					url: '/pages/oneClickLogin/oneClickLogin'
				})
			},
			goPage() {
				uni.navigateTo({
					url: '/pages/starclock/starclock'
				})
			},
			getPosition() {
				uni.getLocation({
					type: 'wgs84',
					geocode:true,//设置该参数为true可直接获取经纬度及城市信息
					success: (res) => {
						console.log(res)
						this.addrDel = JSON.stringify(res);
					},
					fail: function () {
						uni.showToast({
							title: '获取地址失败，将导致部分功能不可用',
							icon:'none'
						});
					}
				});
			},
			setAlarm(hour,minutes,message) {
			 
				var that = this;
				var Intent = plus.android.importClass('android.content.Intent');
				var AlarmClock = plus.android.importClass("android.provider.AlarmClock");
				var intent = new Intent(AlarmClock.ACTION_SET_ALARM);
							
				//闹钟的小时
				intent.putExtra(AlarmClock.EXTRA_HOUR, hour);
			 
				//闹钟的分钟
				intent.putExtra(AlarmClock.EXTRA_MINUTES, minutes);
			 
				//响铃时提示的信息
				intent.putExtra(AlarmClock.EXTRA_MESSAGE, message);
			 
				//对于一次性闹铃，无需指定此 extra
				//一个 ArrayList，其中包括应重复触发该闹铃的每个周日。
				// 每一天都必须使用 Calendar 类中的某个整型值（如 MONDAY）进行声明。
				//例如[this.Calendar.MONDAY,this.Calendar.TUESDAY,this.Calendar.WEDNESDAY]
				intent.putExtra(AlarmClock.EXTRA_DAYS, this.alarmDayList);
			 
				//用于指定该闹铃触发时是否振动
				intent.putExtra(AlarmClock.EXTRA_VIBRATE, true);
							
				//如果为true，则调用startActivity()不会进入手机的闹钟设置界面
				intent.putExtra(AlarmClock.EXTRA_SKIP_UI, true);
			    
			    //清空任务中在其之上的Activity
				intent.setFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);
				
				var main = plus.android.runtimeMainActivity();
				plus.android.importClass("android.app.Activity");
			 
				if (intent.resolveActivity(main.getPackageManager()) != null) {
					main.startActivity(intent);
				}
			},
			doUtsAdd() {
			
			                // let params = {
			                //     name : 'dida', //闹铃名称
			                //     weekday : '123456', //重复星期
			                //     hour : 10, //闹铃时
			                //     minutes : 14, //分钟
			                //     ringtone : 'https://jubaomusics.oss-cn-beijing.aliyuncs.com/%E4%B8%89%E5%8F%AA%E5%B0%8F%E7%8C%AA/%E4%B8%89%E5%8F%AA%E5%B0%8F%E7%8C%AA.mp3', //铃声
			                // }
			//                 alarmAdd({
			//                     params:params,
			//                     success: (res) => {
			//                         console.log('success', res)
			
			//                     },
			//                     fail: (res) => {
			//                         console.log('fail', res)
			//                     },
			//                     complete: () => {
			//                         console.log('complete')
			//                     },
			//                 })
			},
			doUtsDelete() {
				// alarmDelete()
			},
			
			
		}
	}
</script>

<style lang="less">
.delbox {
	width: 630rpx;
	height: 320rpx;
	background: #FFFFFF;
	border-radius: 32rpx;
	padding: 40rpx 40rpx 30rpx 40rpx;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	// justify-content: center;
	flex-direction: column;
	.title {
		margin-bottom: 40rpx;
		text {
			font-weight: bold;
			font-size: 36rpx;
			color: #1A1A1A;
			line-height: 50rpx;
		}
	}
	.desc {
		margin-bottom: 40rpx;
		text {
			font-weight: 400;
			font-size: 28rpx;
			color: #1A1A1A;
			line-height: 40rpx;
		}
	}
	.footer {
		width: 100%;
		// background-color: red;
		display: flex;
		justify-content: space-between;
		
		.confirm {
			width: 230rpx;
			height: 80rpx;
			border-radius: 40rpx;
			border: 2rpx solid #D9D9D9;
			font-weight: bold;
			font-size: 30rpx;
			color: #1A1A1A;
			line-height: 42rpx;
			box-sizing: border-box;
			display: flex;
			justify-content: center;
			align-items: center;
		}
		.cancel {
			width: 230rpx;
			height: 80rpx;
			background: #006FF6;
			border-radius: 40rpx;
			font-weight: bold;
			font-size: 30rpx;
			color: #FFFFFF;
			line-height: 40rpx;
			box-sizing: border-box;
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}
}

.timebox {
	height: 572rpx;
	background: #FFFFFF;
	border-radius: 32rpx 32rpx 0rpx 0rpx;
	padding: 30rpx 40rpx;
	.title {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 60rpx;
		text {
			font-weight: bold;
			font-size: 34rpx;
			color: #1A1A1A;
			line-height: 48rpx;
		}
		image {
			width: 45rpx;
			height: 45rpx;
		}
	}
	.boxaa {
		display: flex;
		justify-content: space-between;
		margin-bottom: 32rpx;
		.box {
			width: 320rpx;
			height: 100rpx;
			background: #F5F7F9;
			border-radius: 16rpx;
			padding: 30rpx 20rpx;
			box-sizing: border-box;
			display: flex;
			align-items: center;
			justify-content: space-between;
			text {
				font-weight: 400;
				font-size: 28rpx;
				color: #999999;
				line-height: 40rpx;
			}
			image {
				width: 48rpx;
				height: 48rpx
			}
		}
	}
	.desc {
		display: flex;
		align-items: center;
		margin-bottom: 62rpx;
		image {
			width: 48rpx;
			height: 46rpx;
			margin-right: 2rpx;
		}
		text {
			font-size: 28rpx;
			color: #0179FF;
			line-height: 40rpx;
		}
	}
	.footer {
		.confirm {
			height: 88rpx;
			background: #006FF6;
			border-radius: 44rpx;
			font-weight: bold;
			font-size: 30rpx;
			color: #FFFFFF;
			line-height: 42rpx;
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}
	
}

	.time2box {
		height: 572rpx;
		background: #FFFFFF;
		border-radius: 32rpx 32rpx 0rpx 0rpx;
		padding: 30rpx 40rpx;
		.title {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-bottom: 60rpx;
			text {
				font-weight: bold;
				font-size: 34rpx;
				color: #1A1A1A;
				line-height: 48rpx;
			}
			image {
				width: 45rpx;
				height: 45rpx;
			}
		}
		.boxaa {
			display: flex;
			justify-content: space-between;
			margin-bottom: 32rpx;
			.box {
				width: 320rpx;
				height: 100rpx;
				background: #F5F7F9;
				border-radius: 16rpx;
				padding: 30rpx 20rpx;
				box-sizing: border-box;
				display: flex;
				align-items: center;
				justify-content: space-between;
				text {
					font-weight: 400;
					font-size: 28rpx;
					color: #999999;
					line-height: 40rpx;
				}
				image {
					width: 48rpx;
					height: 48rpx
				}
			}
		}
		.desc {
			display: flex;
			align-items: center;
			margin-bottom: 62rpx;
			image {
				width: 48rpx;
				height: 46rpx;
				margin-right: 2rpx;
			}
			text {
				font-size: 28rpx;
				color: #0179FF;
				line-height: 40rpx;
			}
		}
		.footer {
			.confirm {
				height: 88rpx;
				background: #006FF6;
				border-radius: 44rpx;
				font-weight: bold;
				font-size: 30rpx;
				color: #FFFFFF;
				line-height: 42rpx;
				display: flex;
				justify-content: center;
				align-items: center;
			}
		}
	}
	
	.clockbox {
		height: 572rpx;
		background: #FFFFFF;
		border-radius: 32rpx 32rpx 0rpx 0rpx;
		padding: 30rpx 40rpx;
		.title {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-bottom: 60rpx;
			text {
				font-weight: bold;
				font-size: 34rpx;
				color: #1A1A1A;
				line-height: 48rpx;
			}
			image {
				width: 45rpx;
				height: 45rpx;
			}
		}
		.boxaa {
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			margin-bottom: 32rpx;
			.box {
				// width: 320rpx;
				margin-bottom: 20rpx;
				height: 100rpx;
				background: #F5F7F9;
				border-radius: 16rpx;
				padding: 30rpx 20rpx;
				box-sizing: border-box;
				display: flex;
				align-items: center;
				justify-content: space-between;
				text {
					font-weight: 400;
					font-size: 28rpx;
					color: #999999;
					line-height: 40rpx;
				}
				image {
					width: 48rpx;
					height: 48rpx
				}
			}
		}
		.desc {
			display: flex;
			align-items: center;
			margin-bottom: 62rpx;
			image {
				width: 48rpx;
				height: 46rpx;
				margin-right: 2rpx;
			}
			text {
				font-size: 28rpx;
				color: #0179FF;
				line-height: 40rpx;
			}
		}
		.footer {
			.confirm {
				height: 88rpx;
				background: #006FF6;
				border-radius: 44rpx;
				font-weight: bold;
				font-size: 30rpx;
				color: #FFFFFF;
				line-height: 42rpx;
				display: flex;
				justify-content: center;
				align-items: center;
			}
		}
	}
	
	
	
	
	.scenbox {
		height: 914rpx;
		background: #FFFFFF;
		border-radius: 32rpx 32rpx 0rpx 0rpx;
		padding: 30rpx 40rpx;
		.title {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-bottom: 60rpx;
			.a {
				font-weight: bold;
				font-size: 34rpx;
				color: #1A1A1A;
				line-height: 48rpx;
			}
			.b {
				font-weight: 400;
				font-size: 28rpx;
				color: #0179FF;
				line-height: 40rpx;
			}
		}
		.subtitle {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-bottom: 20rpx;
			.left {
				font-weight: 400;
				font-size: 28rpx;
				color: #1A1A1A;
				line-height: 40rpx;
			}
			.right {
				font-weight: 400;
				font-size: 28rpx;
				color: #595959;
				line-height: 40rpx;
			}
		}
		.box11 {
			display: flex;
			justify-content: center;
			align-items: center;
			margin-bottom: 30rpx;
			height: 100rpx;
			background: #F5F7F9;
			border-radius: 16rpx;
			.box {
				// width: 320rpx;
				height: 100rpx;
				// background: #F5F7F9;
				// border-radius: 16rpx;
				padding: 30rpx 20rpx;
				box-sizing: border-box;
				display: flex;
				align-items: center;
				// justify-content: space-between;
				text {
					font-weight: 400;
					font-size: 28rpx;
					color: #999999;
					line-height: 40rpx;
				}
				// image {
				// 	width: 48rpx;
				// 	height: 48rpx
				// }
			}
			.splite {
				width: 32rpx;
				height: 2rpx;
				background: #AAAAAA;
				margin: 0 104rpx;
			}
		}
		.boxaa {
			display: flex;
			justify-content: space-between;
			margin-bottom: 32rpx;
			.box {
				width: 320rpx;
				margin-bottom: 20rpx;
				height: 100rpx;
				background: #F5F7F9;
				border-radius: 16rpx;
				padding: 30rpx 20rpx;
				box-sizing: border-box;
				display: flex;
				align-items: center;
				justify-content: space-between;
				text {
					font-weight: 400;
					font-size: 28rpx;
					color: #999999;
					line-height: 40rpx;
				}
				image {
					width: 48rpx;
					height: 48rpx
				}
			}
		}
		.beizhu {
			display: flex;
			align-items: center;
			padding: 0 20rpx;
			height: 100rpx;
			background: #F5F7F9;
			border-radius: 16rpx;
			margin-bottom: 40rpx;
			input {
				font-weight: 400;
				font-size: 28rpx;
				color: #999999;
				line-height: 40rpx;
			}
		}
		.footer {
			.confirm {
				height: 88rpx;
				background: #006FF6;
				border-radius: 44rpx;
				font-weight: bold;
				font-size: 30rpx;
				color: #FFFFFF;
				line-height: 42rpx;
				display: flex;
				justify-content: center;
				align-items: center;
			}
		}
	}
</style>
